<template>
	<view class="wp">
		<view class="upbg">
			<view class="wp-up">
				<view class="touxiang">
					<image src="./touxiang.jpg" mode=""></image>
				</view>
				<view class="denglu">
					<view class="dl">
						<text>登录</text>
						/
						<text>注册</text>
					</view>
					<text>请登录获取您的状态信息</text>
				</view>
			</view>
		</view>
		<view class="nav">
			<view class="nav-li">
				<view class="nav-logo">
					<image src="./lg.1.jpg" mode=""></image>
				</view>
				<view class="nav-tiao">
					<text>关于南博</text>
					<image src="./jiantou.jpg" mode=""></image>
				</view>
			</view>
			<view class="nav-li">
				<view class="nav-logo">
					<image src="./lg.2.jpg" mode=""></image>
				</view>
				<view class="nav-tiao">
					<text>意见反馈</text>
					<image src="./jiantou.jpg" mode=""></image>
				</view>
			</view>
			<view class="nav-li">
				<view class="nav-logo">
					<image src="./lg.3.jpg" mode=""></image>
				</view>
				<view class="nav-tiao">
					<text>APP下载</text>
					<image src="./jiantou.jpg" mode=""></image>
				</view>
			</view>
			<view class="nav-li">
				<view class="nav-logo">
					<image src="./lg.4.jpg" mode=""></image>
				</view>
				<view class="nav-tiao">
					<text>设置</text>
					<image src="./jiantou.jpg" mode=""></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style scoped>
	.upbg{
		background: url(login.jpg) no-repeat 0 0;
		background-size: contain;
		width: 100%;
		height: 408rpx;
	}
	.wp-up{
		padding-top: 188rpx;
		display: flex;
	}
	.wp-up>view{
		margin-left: 30rpx;
	}
	.upbg .touxiang{
		display: block;
		width: 150rpx;
		height: 150rpx;
		border-radius: 50%;
	}
	.upbg .touxiang image{
		width: 100%;
		height: 100%;
		border-radius: 50%;
	}
	.denglu{
		margin-top: 25rpx;
	}
	.denglu .dl{
		font-size: 36rpx;
		color: #fff;
	}
	.denglu>text{
		display: block;
		font-size: 24rpx;
		color: #fff;
		margin-top: 20rpx;
	}
	/* 内容 */
	.nav-li{
		display: flex;
		height: 110rpx;
	}
	.nav-li .nav-logo{
		width: 110rpx;
		height: 110rpx;
		padding-top: 40rpx;
		margin-left: 40rpx;
	}
	.nav-li .nav-logo image{
		width: 35rpx;
		height: 35rpx;
	}
	/*  */
	.nav-li .nav-tiao {
		border-bottom: 1rpx #dddddd solid;
		width: 100%;
		line-height: 110rpx;
		font-size: 30rpx;
		color: #2f2f2f;
		display: flex;
		justify-content: space-between;
	}
	.nav-li .nav-tiao image{
		width: 12rpx;
		height: 23rpx;
		margin-top: 40rpx;
		margin-right: 30rpx;
	}
	
</style>
